import Vue from 'vue'
import Vuex from 'vuex'
import todofooter from './modules/todofooter'
import todoheader from './modules/todoheader'
import todomain from './modules/todomain'
import createPersistedState from "vuex-persistedstate";

Vue.use(Vuex)

export default new Vuex.Store({
    modules: {
        todofooter,
        todoheader,
        todomain
    },
    getters: {
        list(state) {
            if (state.todofooter.show === 'all') {
               return state.todomain.list
            } else if (state.todofooter.show === 'no') {
                return state.todomain.list.filter(item => !item.isDone)
            } else{
                return state.todomain.list.filter(item => item.isDone)
            }
         } 
    },
    plugins: [createPersistedState({
        key: 'myToDoList',
        paths: ['todomain.list'],
    })]
})